// src/views/login/AdminRegister.jsx

import { useState } from 'react';
import { useNavigate } from 'react-router-dom';
import { Button, Form, Input, message } from 'antd';
import { adminAuth } from '../../apis/auth'; // 修改引入路径
import './AdminRegister.less'; // 引入 Less 文件

const AdminRegister = () => {
    const [loading, setLoading] = useState(false);
    const navigate = useNavigate();

    const onFinish = async (values) => {
        setLoading(true);
        try {
            const response = await adminAuth.register(values); // 使用 adminAuth.register
            if (response.data.code === 200) {
                message.success('注册成功');
                navigate('/');
            } else {
                message.error(response.data.message);
            }
        } catch (error) {
            message.error('注册失败');
        } finally {
            setLoading(false);
        }
    }

    return (
        <div className="container">
            <Form
                name="register"
                className="form"
                labelCol={{ span: 8 }}
                wrapperCol={{ span: 24 }}
                onFinish={onFinish}
                onFinishFailed={(errorInfo) => console.log('Failed:', errorInfo)}
                autoComplete="off"
            >
                <div className="title">管理员注册</div>
                <Form.Item
                    label=""
                    name="name"
                    rules={[{ required: true, message: '请输入您的姓名!' }]}
                >
                    <Input placeholder="请输入您的姓名" />
                </Form.Item>

                <Form.Item
                    label=""
                    name="account"
                    rules={[{ required: true, message: '请输入您的账号!' }]}
                >
                    <Input placeholder="请输入您的账号" />
                </Form.Item>

                <Form.Item
                    label=""
                    name="password"
                    rules={[{ required: true, message: '请输入您的密码!' }]}
                >
                    <Input.Password placeholder="请输入您的密码" />
                </Form.Item>

                <Form.Item
                    label=""
                    name="confirmPassword"
                    dependencies={['password']}
                    hasFeedback
                    rules={[
                        { required: true, message: '请确认您的密码!' },
                        ({ getFieldValue }) => ({
                           validator(_, value) {
                                if (!value || getFieldValue('password') === value) {
                                    return Promise.resolve();
                                }
                                return Promise.reject(new Error('两次输入的密码不一致!'));
                            },
                        }),
                    ]} 
                >
                    <Input.Password placeholder="请确认您的密码" />
                </Form.Item>

                <Form.Item className="register-buttons">
                    <Button type="primary" htmlType="submit" className="register-button" loading={loading}>
                        注册
                    </Button>
                    <Button type="primary" className="return-button" onClick={() => navigate('/')}>
                        返回
                    </Button>
                </Form.Item>
            </Form>
        </div>
    );
};

export default AdminRegister;
